<template>
    <div>
        <div class="head">
            <van-sticky>
              <search></search>
            </van-sticky>
            <swiper></swiper>
            <img :src="require('../assets/img/gg.jpg')">
        </div>
        <indexone></indexone>
        <div class="mid">
            <indexmid-11 name="图书畅销榜" title="热门好书"></indexmid-11>
            <indexmid-13 name="新书上架" title="抢先阅读"></indexmid-13>
        </div>
        <div class="db">
          <indexmid-2></indexmid-2>
          <indexmid-3></indexmid-3>
        </div>
        <aa></aa>
    </div>
</template>

<script>
import search from '../components/IndexSearch.vue';
import swiper from '../components/IndexSwipe.vue';
import indexone from '../components/IndexOne.vue';
import indexmid11 from '../components/IndexMid11.vue';
import indexmid13 from '../components/IndexMid13.vue';
import indexmid2 from '../components/IndexMid21.vue';
import indexmid3 from '../components/IndexMid31.vue';
import aa from '../components/AA.vue';
export default {
  name: "IndexView",
  components: {
      search,
      swiper,
      indexone,
      indexmid11,
      indexmid13,
      indexmid2,
      indexmid3,
      aa,
  }
};
</script>

<style lang="scss" scoped>
  .head{
    background: lightpink;
    img{
      width: 100%;
    }
  }
  .mid{
    display: flex;
  }
  
  .my-swipe .van-swipe-item {
    color: #fff;
    font-size: 20px;
    line-height: 150px;
    text-align: center;
    background-color: #39a9ed;
  }
</style>